function tables(x, y) {
    var _this
    class Tab {
        constructor(id) {
            _this = this
            this.main = document.querySelector(id);
            this.tbody = this.main.querySelector('tbody');
            this.addTabs = this.main.querySelector('.addTab')
            this.init()
        }
        init() {
            if ( this.addTabs = this.main.querySelector('.addTab')) {
                 this.addTab()
            }      
            this.updateNode()
            this.removeTab()
            this.editTab()
        }
        //1.获取节点
        updateNode() {
            this.tr = this.tbody.querySelectorAll('tr')
            this.amend = this.main.querySelectorAll('.amend')
            this.delet = this.main.querySelectorAll('.delet')
            this.sure = this.main.querySelectorAll('.sure')
            this.back = this.main.querySelectorAll('.back')
        }  
        //2.添加功能
        addTab() {
            this.addTabs.addEventListener('click', function () {
                _this.tbody.insertAdjacentHTML('beforeBegin', y)
                _this.updateNode()
                _this.removeTab()
                _this.editTab()
            })

        }
        //3.删除功能
        removeTab() {
            this.updateNode()
            this.delet.forEach(function (item) {
                item.addEventListener('click', function () {
                    item.parentNode.parentNode.parentNode.remove()
                })
            })

        }
        //4.修改功能
        editTab() {
            this.updateNode()
            let arr = []
            this.amend.forEach(function (item) {
                item.onclick = function () {
                    let tds = this.parentNode.parentNode.parentNode.children
                    $(this).hide().siblings().hide();
                    $(this).siblings(".sure").show()
                    $(this).siblings(".back").show()
                    for (let i = 0; i < tds.length; i++) {
                        if (i != 0 && i != tds.length - 1) {
                            let str = tds[i].textContent
                            arr.push(str)
                            tds[i].innerHTML = `<input type="text" class="form-control" value="${str}">`
                           // let input = _this.main.querySelector('.input')
                           
                        }
                    }
                }
            })
            //确定功能
            _this.sure.forEach(function (item) {
                item.onclick = function () {
                    arr=[]
                    let tds = this.parentNode.parentNode.parentNode.children
                    $(this).hide().siblings().hide();
                    $(this).siblings(".amend").show()
                    $(this).siblings(".delet").show()
                    for (let i = 0; i < tds.length; i++) {
                        if (i != 0 && i != tds.length - 1) {
                            let str = tds[i].children[0].value
                            
                            arr.push(str)
                            tds[i].innerHTML = str
                        }
                    }
                }
            })
            //取消功能
            _this.back.forEach(function (item) {
                item.onclick = function () {
                    let tds = this.parentNode.parentNode.parentNode.children
                    $(this).hide().siblings().hide();
                    $(this).siblings(".amend").show()
                    $(this).siblings(".delet").show()
                    for (let i = 0; i < tds.length; i++) {
                        if (i != 0 && i != tds.length - 1) {
                            tds[i].innerHTML = ''
                            tds[i].innerHTML = arr[i - 1]
                        }
                    }
                }
            })

        }
    }
    new Tab(x)
}
